<template>
    <div>
        <div class='online_music'>
			<dl>
				<dt>在线音乐</dt>
				<dd class='icon_dd dd_1_black' @click="one">推荐</dd>
				<dd class='icon_dd dd_2_black'>音乐馆</dd>
				<dd class='icon_dd dd_3_black'>视频</dd>
				<dd class='focusDd icon_dd dd_4_white'>电台</dd>
			</dl>
		</div>
    </div>
</template>

<script >
import router from '../router/index'
export default {
	setup() {

const one=()=>{
	router.push('/view/menu')
}
		return {
			one,
			router
		}
	}
}

</script>

<style>
.leftNav .online_music {
	width: 160px;
	margin: 20px auto 30px auto;
}

.leftNav .online_music dt {
	height: 47px;
	line-height: 47px;
	color: #787878;
}

.leftNav .online_music dd {
	height: 30px;
	line-height: 30px;
	color: #303030;
	border-radius: 5px;
	padding-left: 39px;
	margin-bottom: 10px;
	cursor: pointer;
}

/*dd被选中*/
.leftNav .online_music dd.focusDd {
	background-color: #1ed0a1;
	color: #d2f6ee;
}

/*dd的hover样式*/
.leftNav .online_music dd:hover {
	background: #d8d8d8;
}

/*dd的icon图标*/
.leftNav .online_music dd.icon_dd {
	background-size: 22px;
	background-repeat: no-repeat;
	background-position: 9px center;
}

</style>